<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>退款申请</title>
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">

    <!--标准mui.css-->
    <link rel="stylesheet" href="${base!}/assets/front/h5/css/mui.min.css" />
    <link rel="stylesheet" href="${base!}/assets/front/h5/css/hryc.css" />
    <!--App自定义的css-->
    <!--<link rel="stylesheet" type="text/css" href="../css/app.css"/>-->
    <style>
        .mui-table-view .mui-media-object {
            line-height: 42px;
            max-width: 145px;
            height: 100px;
        }
        .jiage-text{
            font-size: 18px;
            color: red;
            margin-right:10px ;
        }
        [v-cloak]{
            display: none !important;
        }
    </style>
</head>
<body>


<header class="mui-bar mui-bar-nav top-color">
    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left" style="color: white;"></a>
    <h1 class="mui-title" style="color: white;">
        退款申请
    </h1>
</header>

<div class="mui-card" style="margin-top: 60px;" id="vue">
    <div class="mui-content-padded">
        <h5 class="mui-content-padded">退款理由</h5>
        <select class="mui-btn mui-btn-block" v-model="typeNote">
            <option  selected>7天无理由退货</option>
            <option >商品与描述不符合</option>
            <option >未按约定时间发货</option>
            <option >少件漏发</option>
        </select>
    </div>
    <div class="mui-input-row" style="margin: 10px 5px;">
        <textarea id="textarea" v-model="note" rows="5" placeholder="请输入退款理由及备注"></textarea>
    </div>
    <div style="width: 300px;margin: 0 auto;">
        <button type="button" v-on:click="add" class="mui-btn mui-btn-primary mui-btn-block">提交</button>
    </div>

</div>




    <script type="text/javascript" src="${base!}/assets/front/h5/js/mui.js" ></script>
    <script type="text/javascript" src="${base!}/assets/front/h5/js/vue.js" ></script>
    <script type="text/javascript" src="${base!}/assets/front/h5/js/jquery-2.0.0.min.js" ></script>
    <script type="text/javascript" src="${base!}/assets/decorate/pc/decoratecommon/js/layer/mobile/layer.js" ></script>
    <script type="application/javascript">
        mui.init({
            swipeBack:true //启用右滑关闭功能
        });

        var orderId = "${orderId!}";

        var vue = new Vue({
            el: '#vue',
            data: {
                note: '',
                typeNote:''
            },
            created:function () {   //实例初始化创建完成执行

                // this.getvideoList()     //调用自身方法
                this.typeNote = "7天无理由退货";

            },
            methods:{              //定义封装方法
                //保存收货地址
                add:function () {
                    var self = this;
                    var node = "["+self.typeNote+"]"+self.note;
                    $.ajax({
                        type:"POST",
                        url:"${base!}/open/h5/refunds/saveOrderRefunds.html",
                        dataType:"JSON",
                        data:{
                            orderId:orderId,
                            node:node
                        },
                        success:function(data){
                            if (data.code == 0) {
                                var d = data.data;
                                window.location.href='${base!}/open/h5/order/goOrderInfo.html?orderId='+orderId;
                            } else {

                            }
                        }
                    });

                }
            },
            watch:{     //监听器
                // carModel:function () {
                //     this.getProvince();
                // }
            }

        })

    </script>
    </body>
    </html>
